<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{$title}-{$Think.lang.web_name}</title>
    {include file="comm/header"/}
</head>
<body>
{include file="comm/left_menu"/}
{include file="comm/top_menu"/}
<div class="container main">
    <div class="col-sm-12 border-bottom text-right"><a class="btn btn-primary mgr-10" href="/Content/article_list/id/{$article._article_id}"><i class="fa fa-list-ul"></i>&nbsp;{$Think.lang.article_list}</a></div>

    <div class="col-sm-12">
        <div class="col-sm-12"> &nbsp;</div>
        <form class="form-horizontal" method="post" action="/Content/article_save/">

            <div class="form-group">
                <label class="col-sm-3 control-label">{$Think.lang.article_title}</label>
                <div class="col-sm-3">
                    <input class="form-control" name="media_title" value="{$article.media_title}" required>
                </div>
                <small class="col-sm-4 form-tips"></small>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label">{$Think.lang.model_table}</label>
                <div class="col-sm-3">
                    <select class="form-control" name="model_field_id">
                        <option value="0">{$Think.lang.select}</option>
                        {if isset($model_field_list)}
                        {foreach name="$model_field_list" key="key" id="v" index="i"}
                        <option value="{$v.field_id}" {if in_array($v.field_id,[$model.model_field_id])} selected{/if}>{$v.field_name}</option>
                        {/foreach}
                        {/if}
                    </select>
                </div>
                <small class="col-sm-4 form-tips">{$Think.lang.select}是不更新字段信息（初次选择除外）</small>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label">{$Think.lang.checked}</label>
                <div class="col-sm-3">
                    <label class="s-label-radio">
                        <input type="radio" name="checked" value="0" id="checked0" {if in_array($model_field.checked,[0])} checked {/if}>
                        <label for="checked0" class="fa fa-check"></label>{$Think.lang.checked_0}
                    </label>
                    <label class="s-label-radio">
                        <input type="radio" name="checked" value="1" id="checked1" {if in_array($model_field.checked,[1])} checked {/if}>
                        <label for="checked1" class="fa fa-check"></label>{$Think.lang.checked_1}
                    </label>
                </div>
                <small class="col-sm-4 form-tips"></small>
            </div>

            <div class="form-group" style="margin-bottom:0.3em;">
                <label class="col-sm-3 control-label">{if $i=="1"}{$Think.lang.group_rules}{/if}</label>
                <div class="col-sm-3">
                    <input class="form-control"  value="{$v.add_str|raw}{$v.menu_title}" disabled style="background: #fff;">
                </div>
                <small class="col-sm-4 form-tips">
                    <label class="s-label-checkbox">
                        <input type="checkbox" name="group_rules[]" value="{$v.menu_id}" id="group_rules_{$i}" {if in_array($v.menu_id,$group_rules)} checked {/if}>
                        <label for="group_rules_{$i}" class="fa fa-check"></label>
                    </label>
                </small>
            </div>



            <div class="form-group">
                <label class="col-sm-3 control-label">{$Think.lang.article_meida_img}</label>
                <!--KindEditor 图片上传预览部分 单个图片-->
                <div class="col-sm-9">
                    <div class="s-div-img-preview" style="display: none">
                        <div class="s-div-img-item">
                            <img src="" id="img_value">
                            <i class="fa fa-times" aria-hidden="true"></i>
                            <input type="hidden" id="meida_img" name="meida_img"  value="">
                        </div>
                    </div>
                    <div class="s-div-img-upload">
                        <input type="button" class="btn btn-default" id="image_up_btn" value="选择图片">
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label">{$Think.lang.article_meida_img}</label>
                <!--KindEditor 图片上传预览部分-->
                <div class="col-sm-9">
                    <div class="s-div-img-preview" style="display: none">
                        <!--<div class="s-div-img-item">
                            <img src="" id="img1">
                            <i class="fa fa-times" aria-hidden="true"></i>
                            <input type="hidden" id="url1" name="meida_img"  value="">
                        </div>-->
                    </div>
                    <div class="s-div-img-upload">
                        <input type="button" class="btn btn-default" id="images_up_btn" value="选择图片">
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label" style="font-family: '宋体',sans-serif;">选择下面字段</label>

                <small class="col-sm-1 form-tips"></small>
            </div>
            {foreach name="article_fields" key="key" id="v" index="i"}
            <div class="form-group" style="margin-bottom:0.3em;">
                <label class="col-sm-3 control-label">{$v.field_desc}</label>
                <div class="col-sm-3">
                    <input type="hidden" name="fields[{$key}][field_pid]" value="{$v.field_pid}">
                    <input type="hidden" name="fields[{$key}][field_name]" value="{$v.field_name}">
                    <input type="hidden" name="fields[{$key}][field_desc]" value="{$v.field_desc}">
                    <input class="form-control" name="fields[{$key}][field_alias]"  value="{$v.field_alias}"  placeholder="字段别名说明">
                </div>
                <small class="col-sm-4 form-tips">
                    <label class="s-label-checkbox">
                        <input type="checkbox" name="fields[{$key}][checked]" value="1" id="checked{$i}" {if in_array($v.checked,[1])} checked {/if}>
                        <label for="checked{$i}" class="fa fa-check"></label>
                    </label>
                </small>
            </div>
            {/foreach}
            <div class="form-group" style="margin-bottom: 4em;margin-top: 1em;">
                <label class="col-sm-3 control-label"></label>
                <div class="col-sm-7">
                    <a href="javascript:all_select();" class="btn btn-primary" style="margin-right: 2em;">全选</a>
                    <a href="javascript:not_all_select();" class="btn btn-primary">全不选</a>
                </div>
            </div>


            <div class="form-group">
                <label class="col-sm-3 control-label"></label>
                <div class="col-sm-3">
                    <input type="hidden" name="article_id" value="{$article.article_id}">
                    <input type="hidden" name="token" value="">
                    <button class="btn btn-primary" type="submit">提交保存</button>
                </div>
                <small class="col-sm-4 form-tips"></small>
            </div>

        </form>
    </div>
</div>
{include file="comm/footer"/}

{if $KE == "1"}
<script type="text/javascript">
    /*kindEditor 富文本编辑器部分*/
    KindEditor.ready(function(K) {
        window.KE={};
        var editor = K.editor({
            //显示图片空间
            allowFileManager : true
        });
        KE.K = K;
        KE.editor = editor;
        // K('#image2').click(function() {
        //     editor.loadPlugin('image', function() {
        //         editor.plugin.imageDialog({
        //             showLocal : false,
        //             imageUrl : K('#url2').val(),
        //             clickFn : function(url, title, width, height, border, align) {
        //                 K('#url2').val(url);
        //                 editor.hideDialog();
        //             }
        //         });
        //     });
        // });
        // K('#image3').click(function() {
        //     editor.loadPlugin('image', function() {
        //         editor.plugin.imageDialog({
        //             showRemote : false,
        //             imageUrl : K('#url3').val(),
        //             clickFn : function(url, title, width, height, border, align) {
        //                 K('#url3').val(url);
        //                 editor.hideDialog();
        //             }
        //         });
        //     });
        // });
    });

    $(function () {
        /*单张图片*/
        KE.K('#image_up_btn').click(function() {
            KE.editor.loadPlugin('image', function() {
                KE.editor.plugin.imageDialog({
                    imageUrl : "",
                    clickFn : function(url, title, width, height, border, align) {
                        var input_url = KE.K("#media_img");
                        input_url.val(url);
                        var img = KE.K("#img_value");
                        img.attr("src",url);
                        var img_preview = img.parent().parent();
                        img_preview.show();
                        var img_item = $(".s-div-img-item>i", img_preview);
                        img_item.unbind("click");
                        img_item.on("click",function (e) {
                            input_url.val("");
                            img.attr("src","");
                            $(this.parentNode.parentNode).hide();
                        });
                        KE.editor.hideDialog();
                    }
                });
            });
        });

        /*预览图片*/
        $("#images_up_btn,.images_up_btn").click(function (e) {
            try {
                var img_upload = this.parentNode;
                var img_preview = this.parentNode.parentNode.getElementsByTagName("div")[0];
            }catch (e) {

            }
            KE.editor.loadPlugin('image', function() {
                KE.editor.plugin.imageDialog({
                    imageUrl : "",
                    clickFn : function(url, title, width, height, border, align) {
                        var html = "<div class=\"s-div-img-item\" _src='"+url+"'>\n" +
                            "           <img src='"+url+"' >\n" +
                            "           <i class=\"fa fa-times\" aria-hidden=\"true\"></i>\n" +
                            "           <input type=\"hidden\"  name=\"meida_imgs[]\"  value='"+url+"'>\n" +
                            "       </div>";
                        if (img_preview) {
                            $(img_preview).append(html).show();
                        }
                        var img_item = $(".s-div-img-item>i",img_preview);
                        img_item.unbind('click');
                        img_item.on("click",function (e) {
                            $(this.parentNode).remove();
                            if ($(".s-div-img-item>i",img_preview).length<1){
                                $(img_preview).hide();
                            }
                        });
                        KE.editor.hideDialog();
                    }
                });
            });
        });


    });

    var KE_del = "{if $KEs.del == '1'}1{else}0{/if}";
    if (KE_del == "1") {
        Events.add(document,"click",function (e) {
            var e = e || window.event;
            var target = e.target || e.srcElement;
            //删除文件
            if (target.getAttribute("name") == "close_2019") {
                var img = $("div img",target.parentNode)[0];
                var path = img.getAttribute("src");
                confirms(0,{body:"确定要删除该文件吗？删除后将无法恢复"},function () {
                    clearTimeout(target.idd);
                    target.idd = setTimeout(function () {
                        $.post("__KE__/php/del_file.php",{path:path},function (data) {
                            data = JSON.parse(data);
                            console.log(data.code);
                            if (data.code == "1"){
                                tips_success("删除文件成功",function () {
                                    img.parentNode.parentNode.parentNode.removeChild(img.parentNode.parentNode);
                                });
                            }else{
                                tips_fail("删除文件失败");
                            }
                        });
                    },500);
                });
            }
        },true);
        Events.add(document,"mouseover",function (e) {
            var e = e || window.event;
            var target = e.target || e.srcElement;
            var href = target.getAttribute("_href");
            if (/(\.jpg$|\.png$|\.gif$|\.jpeg$|\.bmp$)/i.test(href)) {
                //alert("tupian");
                console.log(target.parentNode.parentNode.childNodes[0].className="");
            }
        },true);
        // document.addEventListener("click",function (e) {
        //     //console.log('1');
        //     var e = e || window.event;
        //     var target = e.target || e.srcElement;
        //     //删除文件
        //     if (target.getAttribute("name") == "close_2019") {
        //         var img = $("div img",target.parentNode)[0];
        //         var path = img.getAttribute("src");
        //         confirms(0,{body:"确定要删除该文件吗？"},function () {
        //             clearTimeout(target.idd);
        //             target.idd = setTimeout(function () {
        //                 $.post("__KE__/php/del_file.php",{path:path},function (data) {
        //                     data = JSON.parse(data);
        //                     console.log(data.code);
        //                     if (data.code == "1"){
        //                         tips_success("删除文件成功",function () {
        //                             img.parentNode.parentNode.parentNode.removeChild(img.parentNode.parentNode);
        //                         });
        //                     }else{
        //                         tips_fail("删除文件失败");
        //                     }
        //                 });
        //             },500);
        //         });
        //     }
        // },true);

        // document.addEventListener("mouseover",function (e) {
        //     //console.log('1');
        //     var e = e || window.event;
        //     var target = e.target || e.srcElement;
        //     var href = target.getAttribute("_href");
        //     if (/(\.jpg$|\.png$|\.gif$|\.jpeg$|\.bmp$)/i.test(href)) {
        //         //alert("tupian");
        //         console.log(target.parentNode.parentNode.childNodes[0].className="");
        //     }
        // },true);

        // document.onmouseover=function () {
        //     //console.log('1');
        //     var e = e || window.event;
        //     var target = e.target || e.srcElement;
        //     var href = target.getAttribute("_href");
        //     if (/(\.jpg$|\.png$|\.gif$|\.jpeg$|\.bmp$)/i.test(href)) {
        //         //alert("tupian");
        //         console.log(target.parentNode.parentNode.childNodes[0].className="");
        //     }
        // }
    }
    //创建富文本编辑器
    function create_KE(select,C,fn) {
        (select) || (select="#media_content");
        (C) || (C = {});
        (C.height) || (C.height=500);
        // 关闭过滤模式，保留所有标签
        (C.filterMode == "off" || C.filterMode === 0 )&&(KindEditor.options.filterMode = false);
        (C.items) || (C.items=[
            'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',
            'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
            'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
            'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
            'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
            'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', /*'multiimage',*/
            /*'flash',*/ /*'media',*/ 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
            'anchor', 'link', 'unlink', /*'|',*/ /*'about'*/
        ]);
        var config = {
            height:C.height,
            //显示图片空间
            allowFileManager:true,
            //编辑器创建时的回调函数
            afterCreate:function(){
                (typeof fn ==="function")&&fn.call(this,"afterCreate");
                /*粘贴图片功能，比如截图 start*/
                var editor = this;
                var editerDoc = this.edit.doc;//得到编辑器的文档对象
                //监听粘贴事件, 包括右键粘贴和ctrl+v
                $(editerDoc).bind('paste', null, function (e) {
                    /*获得操作系统剪切板里的项目，e即kindeditor,
                    *kindeditor创建了originalEvent(源事件)对象，
                    *并指向了浏览器的事件对象，而chrome浏览器
                    *需要通过clipboardData(剪贴板数据)对象的items
                    *获得复制的图片数据。
                    */
                    var ele = e.originalEvent.clipboardData.items;
                    for (var i = 0; i < ele.length; ++i) {
                        //判断文件类型
                        if (ele[i].kind == 'file' && ele[i].type.indexOf('image/') !== -1) {
                            var file = ele[i].getAsFile();//得到二进制数据
                            //创建表单对象，建立name=value的表单数据。
                            var formData = new FormData();
                            formData.append("imgFile", file);//name,value

                            //用jquery Ajax 上传二进制数据
                            $.ajax({
                                url: "__KE__/php/upload_json.php",
                                type: 'POST',
                                data: formData,
                                // 告诉jQuery不要去处理发送的数据
                                processData: false,
                                // 告诉jQuery不要去设置Content-Type请求头
                                contentType: false,
                                dataType: "json",
                                beforeSend: function () {
                                    //console.log("正在进行，请稍候");
                                },
                                success: function (responseStr) {
                                    //上传完之后，生成图片标签回显图片，假定服务器返回url。
                                    var src = responseStr.url;
                                    var imgTag = "<img src='" + src + "' border='0'/>";

                                    //console.info(imgTag);
                                    //kindeditor提供了一个在焦点位置插入HTML的函数，调用此函数即可。
                                    editor.insertHtml(imgTag);


                                },
                                error: function (responseStr) {
                                    console.log("error");
                                }
                            });
                        }
                    }
                });
                /*粘贴图片功能，比如截图 end*/
            },
            //编辑器内容发生变化后执行的回调函数
            afterChange:function () {
                //alert('abc');
                (typeof fn ==="function")&&fn.call(this,"afterChange");
            },
            //编辑器聚焦(focus)时执行的回调函数
            afterFocus:function (){
                (typeof fn ==="function")&&fn.call(this,"afterFocus");
            },
            //编辑器失去焦点(blur)时执行的回调函数
            afterBlur:function(){
                (typeof fn ==="function")&&fn.call(this,"afterBlur");
            },
            //上传文件后执行的回调函数
            afterUpload:function(){
                (typeof fn ==="function")&&fn.call(this,"afterUpload");
            },
            //从图片空间选择文件后执行的回调函数
            afterSelectFile:function () {
                (typeof fn ==="function")&&fn.call(this,"afterSelectFile");
            },
        };
        for (var attr in C){
            config[attr] = C[attr];
        }
        KindEditor.create(select,config);
    }
</script>
{/if}
</body>
</html>